<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<!--
const 定义的变量 和let类似但是不能重新赋值
块作用域
在块作用域内使用const声明的变量与let变量相似,
实例
var x=10;
//此处 x为10
{
  const x = 6;
  此处x为6
}
此处x为10
x在块中声明,不同于块之外声明的x

在声明时进行赋值 js中const变量必须在声明时赋值:
不正确的
const pi;
pi = 3.14;

正确
const pi = 3.14;
关键词 const 有一定的误导性,它没有定义常量值,它定义了对值常量引用,因此我们不能改变常量原始值 但是可以改变常量对象的属性

原始值 如果我们将一个原始值赋给常量 我们就不能改变原始值
const pi =3.14;
pi=3.14;//报错
pi=pi+10 //也会报错

常量对象可以更改,可以更改常量对象的属性
但是无法为常量对象赋值
  const car = {type:"Porsche",model:"911",color:"white"};
  car={type:"Volvo"} // 无法为常量对象赋值

但是常量数值可以更改 可以更改常量数组的元素
无法对常量数组赋值
const cars = ["Audi","BMW","Porsche"];
cars=["Honda"]
重新声明
在程序中的任何位置都允许重新声明js var变量
var x=2
在同一作用域或块中,不允许将已有的var 或 let 变量重新声明或者重新赋值给const

实例
var x=2 //允许
const x=2 //不允许
{
  let x=2 //允许
  const x=2 //不允许
}
在同一作用域或块中 为已有的const变量重新声明声明或赋值是不允许的;
通过var 定义的变量会被提升到顶端,您可以在声明var 变量之前就使用它 通过const定义的变量不会被提升到顶端.const变量不能再声明之前使用
carName="volvo" //不可以在此处使用 carName
const carName="volvo"

js 运算符
实例
向变量赋值 并相加
赋值运算符= 把值赋给变量,加法运算符 + 对数字相加 ,乘法运算符* 对数字相乘
使用 += 赋值运算符也可以用于相加 级联字符串
txt1="Hello"
txt1+="kitty!" // Hello kitty
在用于字符串时,+运算符被称为级联运算符

字符串和数字的相加 相加两个数字 将返回和,但对一个数字和一个字符串相加将返回一个字符串:
实例
x=7+8;
y="7"+8;
z="hello"+7;
提示 如果对数字和字符串相加,结果将是字符串
算术运算符会操作两个数值,这两个数可以是字面量,或者是变量或者是表达式
系数 系数运算符% 返回除法的余数
在算术中,两个整数的除法产生商和余数
在数学中,模运算的结果是算术除法的余数

递增
递增运算符 ++ 对数值进行递增
var x=7;
x++;
var z=x;
递减
递减运算符 -- 对数值进行递减
var x=7
x--
var z=x

幂
取幂运算符（**）将第一个操作数提升到第二个操作数的幂。

js数据类型
字符串值,数值,布尔值,数组,对象 (变量能够保存多种数据类型:数值,字符串值,数组,对象等)
var length =7 //数字
var lastName = "Gates" // 字符串
var cars=["Porsche","volvo","BMW"] // 数组
var x = {firstName:"Bill",lastName:"Gates"} //对象

数据类型是重要的概念
当数值和字符串相加时,js会将数值视为字符串
var x = 911 + "porsche" // "911porsche"
var x = 911 + 7 + "porsche" // 918porsche   js将911和7 视为数值,直到预检porsche 才变为字符串处理
js 拥有动态的类型 ,意味着相同变量可作用不同类型
var x  // x是undefined
var x =7  // x是数值
var x ='bill' // x是字符串

js对象用花括号进行书写,对象属性是 name:value 对 由逗号分隔
var person = {firstName:"bill", lastName="Gates"}
typeof 运算符 来确定js 变量的类型 type运算符返回变量或表达式的类型
typeof "" // 返回string
typeof "bill" // 返回string
typeof "bill gates" // 返回string

null 在js中null是nothing 它贝看做不存在的事物,在js中null 的数据类型是对象,
可以通过设置值 为null 清空对象
var person = null 值为null但是类型仍然是对象
也可以设置值为undefined 清空对象
var person = undefined;
undefined 与 null 的值相等 但是类型不相等
typeof undefined // undefined
typeof null // object
null === undefined //false
null == undefined //true

原始数据值是一种没有额外属性和方法的单一简单数据值
typeof 运算符可以返回 以下原始类型之一 string number boolean undefined
typeof "Bill"              // 返回 "string"
typeof 3.14                // 返回 "number"
typeof true                // 返回 "boolean"
typeof false               // 返回 "boolean"
typeof x                   // 返回 "undefined" (假如 x 没有值)

typeof 运算符把对象、数组或 null 返回 object。

typeof 运算符不会把函数返回 object。
typeof {name:'Bill', age:62} // 返回 "object"
typeof [1,2,3,4]             // 返回 "object" (并非 "array"，参见下面的注释)
typeof null                  // 返回 "object"
typeof function myFunc(){}   // 返回 "function"


js 函数是被设计为执行特定任务的代码块
js函数会在某代码调用它时被执行
js函数通过 function 关键词进行定义,其后是函数名和括号 ()
函数名可包含字母,数字,下划线,和美元符号 规则与变量名相同
圆括号可由逗号分隔的参数 (参数1,参数2)
由函数执行的代码被放置在花括号中,{}
function name(参数1,参数2,参数3){
  要执行的代码
}
函数参数 是在函数定义中所列的名称,当调用函数时由函数接收的真实的值

在函数中参数是局部变量

函数中的代码将在其他代码调用该函数时执行:
当事件发生时 当用户点击按钮时
当js代码调用时
自动的 自调的

函数返回 当js到达return语句,函数将停止执行.如果函数被某条语句调用,js将在调用语句之后返回执行代码
函数通常会计算出返回值,这个返回值会返回给调用者

为什么使用函数 ,可以对代码进行复用:只要定义一次代码,就可以多次使用它.可以多次向同一函数传递不同的参数,以产生不同的结果
() 运算符调用函数 ,toCelsius 引用的是函数对象,而toCelsius() 引用的是函数结果
访问 没有() 的函数将返回函数定义

用作变量值的函数 函数的使用方法和变量一致
在js函数中声明的变量,会成为函数的局部变量,局部变量只能在函数内访问

// 此处的代码不能使用carName
function myFunction(){
  var carName = "Volvo"
  //此处的代码可以使用 carName
}
//此处的代码不能使用carName

由于局部变量只能被其函数识别,因此可以在不同函数中使用相同名称的变量,局部变量在函数开始时创建,在函数完成时被删除


对象 :  理解为 所有汽车是一个对象 ,所有汽车拥有相同的属性,但是属性会因车而异 ,所有汽车都拥有相同的方法 但是方法会在不同时间被执行
js 变量是数据值的容器, 把单一值 赋值给名为car的变量
var car = "porsche";
对象也是变量 ,但是对象包含很多值
var car = {type:"porsche",model:"911",color:"white'};
值 以 名称:值对的方式来书写 名称和值有冒号分隔
js 对象是被命名值的容器

对象属性
js对象只能 名称:值对被称为属性
var car = {type:"porsche",model:"911",color:"white'};
属性 type
属性值 porsche

对象也可以有方法 方法是在对象上执行的动作,方法以函数定义被存储在属性中
属性 firstName  属性值 Bill
方法是作为属性来存储的函数
var person = {
  firstName: "Bill",
  lastName : "Gates",
  id       : 678,
  fullName : function() {
    return this.firstName + " " + this.lastName;
  }
};


this 关键词
函数定义中 this引用该函数的拥有者,this指的是拥有 fullName函数的person对象
换言之 this.firstName 的意思是this对象的firstName属性

对象定义
var person = {firstName:"Bill", lastName:"Gates", age:62, eyeColor:"blue"};
空格和折行都是允许的。对象定义可横跨多行：
var person = {
    firstName:"Bill",
    lastName:"Gates",
    age:50,
    eyeColor:"blue"
};
访问对象属性
使用两种方式访问属性
objectName.propertyName
  例 person.lastName;
objectName["propertyName"]
  例 person["lastName"];


您能够通过如下语法访问对象方法：
objectName.methodName()
  例 name = person.fullName();
如果您不使用 () 访问 fullName 方法，则将返回函数定义：
  name = person.fullName;

方法实际上是以属性值的形式存储的函数定义。
请不要把字符串、数值和布尔值声明为对象！
如果通过关键词 "new" 来声明 JavaScript 变量，则该变量会被创建为对象：
var x = new String();        // 把 x 声明为 String 对象
var y = new Number();        // 把 y 声明为 Number 对象
var z = new Boolean();       //	把 z 声明为 Boolean 对象
请避免字符串、数值或逻辑对象。他们会增加代码的复杂性并降低执行速度。





-->
<body>
<div>
  <h5>const 的变量</h5>
  <p>无法改变原值</p>
  <p id="demo"></p>
  <p id="demo1"></p>
  <p id="demo2"></p>
  <p>x=7,y=8,计算z=x+y,然后显示z:</p>
  <p id="demo3"></p>
  <br>
  <p>本例调用了一个执行计算的函数,然后返回结果 : </p>
  <p id="demo4"></p>
  <p>本例验证返回值</p>
  <p id="demo5"></p>
  <p>本例把华氏度转为摄氏度</p>
  <p id="demo6"></p>
  <p>返回没有()的函数将返回函数定义</p>
  <p id="demo7"></p>
  <p>使用变量作为传递的值</p>
  <p id="demo8"></p>
  <p>创建对象,提取对象值</p>
  <p id="demo9"></p>

</div>
<script>
  try {
    let PI = 3.1415926;
    PI = 3.14;
  } catch (err) {
    document.getElementById('demo').innerHTML = err;
  }
  //创建对象
  const car = {type: "Porsche", model: "911", color: "white"};
  //更改属性
  car.color = "red";
  //添加属性
  car.owner = "Steve";
  //显示属性
  document.getElementById("demo1").innerHTML = "车主是" + car.owner;
  //创建数组
  const cars = ["Audi", "BMW", "Porsche"];
  //更改元素
  cars[0] = "Toyota";
  //添加元素
  cars.push("Honda");
  //显示数组
  document.getElementById("demo2").innerHTML = cars;
  //运算符
  const x = 7, y = 8, z = x + y;
  document.getElementById("demo3").innerHTML = z;

  //函数计算后返回结果
  function myFunction(p1, p2) {
    return p1 * p2;
  }

  document.getElementById("demo4").innerHTML = myFunction(7, 8);
  //返回值
  var x1 = myFunction1(7, 8)
  document.getElementById("demo5").innerHTML = x1;

  function myFunction1(p1, p2) {
    return p1 + p2;
  }

  function toCelsius(fahrenheit){
    return (5/9)*(fahrenheit-32);
  }
  document.getElementById("demo6").innerHTML=toCelsius(77);
  document.getElementById("demo7").innerHTML=toCelsius;
  document.getElementById("demo8").innerHTML="温度是:" + toCelsius(86) + "摄氏度.";
  var person = {
    firstName : "Bill",
    lastName  : "Gates",
    age       : 62,
    eyeColor  : "blue"
  };
  //显示对象中的数据
  document.getElementById("demo9").innerHTML=person.firstName+"已经"+person.age+"岁了.";
</script>
</body>
</html>
